import vue from 'vue';
import vueRouter from 'vue-router'

vue.use(vueRouter);

const layout = () => import('@/views/layout/layout')
const home = () => import('@/views/home/home')
const NotFound = () => import('@/views/404')
const categoryParam = () => import('@/views/goods/categoryParam')
const goodCategory = () => import('@/views/goods/goodCategory')
const goodList = () => import('@/views/goods/goodList')
const addGood = () => import('@/views/goods/childComponents/GoodList/addGood')
const orderList = () => import('@/views/order/orderList')
const dataTable = () => import('@/views/statistic/dataTable')
const userList = () => import('@/views/user/userList')
const roleList = () => import('@/views/permission/roleList')
const permissionList = () => import('@/views/permission/permissionList')
const login = () => import('@/views/Login')

import { getToken } from "@/util/auth"
import store from '../store';
import { Store } from 'vuex';

//解决vue路由重复导航错误
//获取原型对象上的push函数
const originalPush = vueRouter.prototype.push
//修改原型对象中的push方法
vueRouter.prototype.push = function push(location) {
    return originalPush.call(this, location).catch(err => err)
}

const routes = [
    {
        path: '/',
        redirect: '/login'
    },
    {
        path: '/login',
        component: login,
        meta: { title: '用户登录' }
    },
    {
        path: '/layout',
        component: layout,
        redirect: '/layout/home',
        children: [
            {
                name: '首页',
                path: 'home',
                component: home,
                meta: { title: '首页' },
            }
        ]
    },
    // {
    //     name: '用户管理',
    //     path: '/user',
    //     component: layout,
    //     redirect: '/user/userList',
    //     children: [
    //         {
    //             name: '用户列表',
    //             path: 'userList',
    //             component: userList,
    //             meta: { title: '用户列表' }
    //         }
    //     ]
    // },
    // {
    //     name: '权限管理',
    //     path: '/permission',
    //     component: layout,
    //     redirect: '/permission/roleList',
    //     children: [
    //         {
    //             name: '角色列表',
    //             path: 'roleList',
    //             component: roleList,
    //             meta: { title: '角色列表' }
    //         },
    //         {
    //             name: '权限列表',
    //             path: 'permissionList',
    //             component: permissionList,
    //             meta: { title: '权限列表' }
    //         }
    //     ]
    // },
    // {
    //     name: '商品管理',
    //     path: '/goods',
    //     component: layout,
    //     hidden: true,
    //     redirect: '/goods/goodList',
    //     children: [
    //         {
    //             name: '商品列表',
    //             path: 'goodList',
    //             component: goodList,
    //             meta: { title: '商品列表' }
    //         },
    //         {
    //             name: '分类参数',
    //             path: 'categoryParam',
    //             component: categoryParam,
    //             meta: { title: '分类参数' }
    //         },
    //         {
    //             name: '商品分类',
    //             path: 'goodCategory',
    //             component: goodCategory,
    //             meta: { title: '商品分类' }
    //         },
    //         {
    //             name: "添加商品",
    //             path: "addGood",
    //             component: addGood,
    //         }
    //     ]
    // },
    // {
    //     name: '订单管理',
    //     path: '/order',
    //     component: layout,
    //     redirect: '/order/orderList',
    //     children: [
    //         {
    //             name: '订单列表',
    //             path: 'orderList',
    //             component: orderList,
    //             meta: { title: '订单列表' }
    //         },
    //     ]
    // },
    // {
    //     name: '数据统计',
    //     path: '/statistic',
    //     component: layout,
    //     redirect: '/statistic/dataTable',
    //     children: [
    //         {
    //             name: '数据报表',
    //             path: 'dataTable',
    //             component: dataTable,
    //             meta: { title: '数据报表' }
    //         }
    //     ]
    // },

]
const routeList = [
    {
        name: '用户管理',
        path: '/user',
        component: layout,
        redirect: '/user/userList',
        children: [
            {
                name: '用户列表',
                path: 'userList',
                component: userList,
                meta: { title: '用户列表' }
            }
        ]
    },
    {
        name: '权限管理',
        path: '/permission',
        component: layout,
        redirect: '/permission/roleList',
        children: [
            {
                name: '角色列表',
                path: 'roleList',
                component: roleList,
                meta: { title: '角色列表' }
            },
            {
                name: '权限列表',
                path: 'permissionList',
                component: permissionList,
                meta: { title: '权限列表' }
            }
        ]
    },
    {
        name: '商品管理',
        path: '/goods',
        component: layout,
        hidden: true,
        redirect: '/goods/goodList',
        children: [
            {
                name: '商品列表',
                path: 'goodList',
                component: goodList,
                meta: { title: '商品列表' }
            },
            {
                name: '分类参数',
                path: 'categoryParam',
                component: categoryParam,
                meta: { title: '分类参数' }
            },
            {
                name: '商品分类',
                path: 'goodCategory',
                component: goodCategory,
                meta: { title: '商品分类' }
            },
            {
                name: "添加商品",
                path: "addGood",
                component: addGood,
            }
        ]
    },
    {
        name: '订单管理',
        path: '/order',
        component: layout,
        redirect: '/order/orderList',
        children: [
            {
                name: '订单列表',
                path: 'orderList',
                component: orderList,
                meta: { title: '订单列表' }
            },
        ]
    },
    {
        name: '数据统计',
        path: '/statistic',
        component: layout,
        redirect: '/statistic/dataTable',
        children: [
            {
                name: '数据报表',
                path: 'dataTable',
                component: dataTable,
                meta: { title: '数据报表' }
            }
        ]
    },];

const createRouter = () => new vueRouter({
    mode: 'history',
    routes
})

// const router = new vueRouter({
//     mode: 'history',
//     routes
// })
const router = createRouter()

//全局前置
router.beforeEach((to, from, next) => {
    console.log(store.state.routerName.length)
    if (getToken() && to.path == "/login") {
        next("/layout")
    } else if (!getToken() && to.path !== "/login") {
        next("/login")
    } else if (!getToken() && to.path == "/login") {
        next()
    }
    else if (store.state.routerName.length == 0) {
        store.dispatch("getSlideName").then(nameList => {
            const RouterData = routeList.filter(item => {
                return nameList.includes(item.name)
            });
            //删除之前add的路由
            const newRouter = createRouter()
            router.matcher = newRouter.matcher; // the relevant part
            // 动态添加
            [...RouterData].forEach(item => {
                router.addRoute(item)
            })
            //404放在最后
            router.addRoute({
                path: '*',
                component: NotFound,
                meta: { title: '404' }
            })
            //白屏
            next({
                ...to,
                replace: true
            })
        })
    }
    next()
})

//后置守卫
router.afterEach((to, from) => {
    document.title = to.path === '/login' ? to.meta.title : '广东海洋大学';

    if (to.path == "/login") {
        //清空vuex-along本地缓存
        store.commit("setRouterName", [])
        // store.commit("setRouterData", [])
        // localStorage.removeItem("vuex-along");
    }
})

export default router